$(function (){
  // 设置屏幕自适应,改变根标签html的font-size大小
  setFont();
  window.onresize = function () {
    setFont();
  };
  // 根据当前屏幕的宽度 动态设置页面根标签的fontsize
  function setFont() {
    // 要设置的字体大小  = 基础值 * 要适配的屏幕的宽度 /  设计稿宽度
    // 基础值
    var baseVal = 100;
    // 设计稿的宽度
    var pageWidth = 375;
    // 要适配的屏幕的宽度 = 当前屏幕的宽度
    var screenWidth = document.querySelector("html").offsetWidth;
    // 要设置的字体大小
    var fontsize = (baseVal * screenWidth) / pageWidth;
    // 把字体大小动态设置到 html标签中
    document.querySelector("html").style.fontSize = fontsize + "px";
  }

  
  /* 使用变量存储拿到的shop和area数据 */
  var ShopData;
  var AreaData;

  $('.gs_head_nav').on("click",">a",function (){
   var index = $(this).index()
  //  console.log(index);
  //   $(".hd .popbox:eq(" + index + ")").toggle().siblings('.popbox').hide();;
  $(".getshop_main .popsort:eq(" + index + ")").toggle().siblings().hide()
  })

  $.ajax({
    url: "http://193.112.55.79:9090/api/getgsshop",
    type:"get",
    dataType:"json",
    success:function (res){
      // console.log(res);
      var data = res.result;
      ShopData = data
      $('.gs_head_nav').html('<a href="javascript:;" data-shopid="' + data[0].shopId + '">' + data[0].shopName + '<i class="glyphicon glyphicon-triangle-top"></i></a>')
      var htmlStr = template("shop_tmp",res)
      $("#shop ul").html(htmlStr)
      // console.log(htmlStr);
      getArea()
    }
  })
 
  /* 获取区域信息 */
  function getArea(){
  $.ajax({
    url: "http://193.112.55.79:9090/api/getgsshoparea",
    type: "get",
    dataType: "json",
    success: function (res) {
      // console.log(res);
      var data = res.result
      AreaData = data

      $('.gs_head_nav').append('<a href="javascript:;" data-areaid="' + data[0].areaId + '">' + data[0].areaName.substr(0, 2) + '<i class="glyphicon glyphicon-triangle-bottom"></i></a>')
      $('.gs_head_nav').append('<a href="javascript:;" >1元<i class="glyphicon glyphicon-triangle-bottom"></i></a>')
      var htmlStr = template("area_tmp", res)
      $("#area ul").html(htmlStr)
      // console.log(htmlStr);

      var shopid = $(".gs_head_nav a:first").data('shopid');
      var areaid = $(".gs_head_nav a:eq(1)").data('areaid');
      // console.log(shopid,areaid);
      getgsproduct(shopid, areaid)
      titleClick(shopid, areaid)

    }
  })
  }
     /* 点击里面的下拉栏隐藏下拉栏并获取到sid和aid */
     function titleClick(shopid, areaid) {
       $(".popsort").on("click","a",function (){
           if ($.isNumeric($(this).data('shopid'))) {
             shopid = $(this).data('shopid');
             // 切换店铺标题   replaceWith换成html 有坑！
             $(".gs_head_nav a:first").replaceWith('<a href="javascript:;" data-shopid="' + ShopData[shopid].shopId + '">' + ShopData[shopid].shopName + '<i class="glyphicon glyphicon-triangle-top"></i></a>');
           } else if ($.isNumeric($(this).data('areaid'))) {
             // 切换区域标题
             areaid = $(this).data('areaid');
             $(".gs_head_nav a:eq(1)").replaceWith('<a href="javascript:;" data-areaid="' + AreaData[areaid].areaId + '">' + AreaData[areaid].areaName.substr(0, 2) + '<i class="glyphicon glyphicon-triangle-bottom"></i></a>');
           } else {
             return;
           }
           // 隐藏菜单
           $(this).closest(".popsort").hide();
           getgsproduct(shopid, areaid);
       })
     }
  function getgsproduct(sid,aid) {
  $.ajax({
    url: "http://193.112.55.79:9090/api/getgsproduct",
    type: "get",
    data:{
      shopid: sid,
       areaid: aid
    },
    dataType: "json",
    success: function (res) {
      // console.log(res);
      var htmlStr = template("detail_tmp", res)
      $(".getshop_detail ul").html(htmlStr)
      // console.log(htmlStr);
    }
  })
  }
  
})